/**
 * Created by Zhao on 2016/11/14.
 */
/**
 //选择器
 id选择器 #id
 var $mdiv = $("#mdiv");
 通过id选择器获得到了一个id为mdiv的元素jquery对象
 class选择器 .class
 元素选择器 element

 *jQuery对象
 *
 $(function () {
    //var $mdiv = $("#mdiv");
    //alert($mdiv.html())
    $(".x").click(
        function () {
            alert($(".x").html())
        }
    )
});
 $(function () {
    //点击p元素则变色
    //获得所有p元素
    var $ps = $("p");
    $ps.click(
        function () {
            if (this.style.color==="red"){
                this.style.color="blue";
                return ;
            }
            this.style.color="red";
        }
    )
    //表格隔行变色
    var $trs = $("tbody tr");
    for(var i=0;i<$trs.length;i++){
        if (i%2==0){
            $($trs[i]).css("backgroundColor","red");
        }
    }
    //输出多选框的选择数量 点击时
    var $checkboxs = $("input ");
    $checkboxs.click(
        function () {
            var amount=0;
            for(var i=0;i<$checkboxs.length;i++){
                    amount++;
                };
                if ($checkboxs[i].is(":checked")){
            }
            alert(amount);
        }
    )

    var $mdiv = $("#mdiv *");
});
 */
$(function () {
    //层次选择器
    /**
     $("#diva1 > div").css("color", "blue");
     $("#divb1 > div").css("color", "red");
     $("#divb2 > div").css("color", "red");
     $("#divb3 > div").css("color", "red");
     **/
    //下一个同辈元素
    //$("#divb1 + div").css("backgroundColor","red");
    //所有同辈元素
    // $("#divb1 ~ div").css("backgroundColor","red");
    //过滤选择器

    // $("div :last").css("backgroundColor", "blue");
    // $("tbody tr:even").css("backgroundColor","red");
    // $("div :not(#divb2)").css("backgroundColor","red");
    //内容过滤器
    // $(":visible").css("backgroundColor", "red");
    //属性过滤选择器
    var $checkbox = $("input[type=checkbox]");
    $checkbox.click(function () {
        alert($("input[type=checkbox]:checked").length);
    });

});
